 {include file="common/meta" /}
    <title>修改个人资料</title>
    <link rel="stylesheet" href="/assets/home/css/profile.css">
    <link href="/assets/home/css/MyCenter.css" rel="stylesheet" />
    <link rel="stylesheet" href="/assets/home/city/css/city-picker.css">
    <script src="/assets/home/js/jquery-1.9.1.min.js"></script>
    <script src="/assets/home/city/js/city-picker.data.min.js"></script>
    <script src="/assets/home/city/js/city-picker.min.js"></script>
  <style>
    .city-picker-dropdown{
        left: -56px !important;
    }
    .city-select-tab{
        display: flex;
        justify-content: space-around;
}
    .city-select a{
        padding: 0px 10px !important;
    }
    dt+dd {
     margin-top: 0em; 
}
  </style>
<body>
    <div class="top_div">
        <img src="/assets/home/images/bac.jpg" class="top_img">
        <div class="userInfo">
            {if condition = "$business.avatar"}
            <img class="uPic" src="{$business['avatar']}" /><br />
            {else /}
            <img class="uPic" src="/assets/home/images/avatar.jpg" /><br />
            {/if}
            <span class="uBalance" style="color: rgb(74, 70, 66); ">{$business.nickname|default="这家伙很懒，什么也没留下"}</span>
        </div>
    </div>
    <div class="form">
        <form method="post" enctype="multipart/form-data">            
            <div class="item">
                <div class="title" style="text-align: left;">
                    昵称：
                </div>
                <input type="text" name="nickname" value="{$business.nickname}">
            </div>
            <div class="item">
                <div class="title" style="text-align: left;">
                    手机号：
                </div>
                <input type="text" name="mobile" value="{$business.mobile}">
            </div>
            <div class="item">
                <div class="title" style="text-align: left;">
                    登录密码：
                </div>
                <input type="password" name="password" style="border: none;">
            </div>
            <div class="item">
                <div class="title" style="text-align: left;">
                    性别：
                </div>
                <div class="sex">
                    <input type="radio" name="gender" {$business['gender']=='0' ? 'checked' : '' } value="0"
                        id="secrecy"><label for="secrecy">保密</label>
                    <input type="radio" name="gender" {$business['gender']=='1' ? 'checked' : '' } value="1"
                        id="man"><label for="man">男</label>
                    <input type="radio" name="gender" {$business['gender']=='2' ? 'checked' : '' } value="2"
                        id="woman"><label for="woman">女</label>
                </div>
            </div>
            <div class="item">
                <div class="title" style="text-align: left;">
                    地区选择：
                </div>
                <div style="position:relative;width: 80%;">
                    <input id="city" readonly type="text" name="region" data-toggle="city-picker">
                </div>
            </div>
            <div class="item">
                <div class="title" style="text-align: left;">
                    修改头像：
                </div>
                <button type="button" class="layui-btn upload-img" onclick="avatar.click()">上传头像</button>  
                  <input type="file" name="avatar"   id="avatar" hidden />
            
               

            </div>
            {if condition = "$business.avatar"}
            <img src="{$business['avatar']}" id="img" style="height: 100px; width:100px;" />
            {else /}
            <img src="/assets/home/images/avatar.jpg" id="img" style="height: 100px; width:100px;" />
            
            {/if}
            
            <div class="item">
                <div class="title" style="text-align: left; width: 580px; ">
                   <span>邀请码：</span> <input type="text"  value="{$business.invitecode}" disabled />
            </div>
            </div>
            <input type="submit" value="修改资料" key="set-mine" style="background-color: #674c3b; color: white;"><br/>
        </form>
    </div>
</body>


</html>
<script>
    $('#city').citypicker({
        province: `{$province}`,
        city:  `{$city}`,
        district:  `{$district}`,
    });
   
     // 预览图片
  function getObjectURL(file) {
    var url = null ; 
    if (window.createObjectURL!=undefined) { // basic
      url = window.createObjectURL(file) ;
    } else if (window.URL!=undefined) { // mozilla(firefox)
      url = window.URL.createObjectURL(file) ;
    } else if (window.webkitURL!=undefined) { // webkit or chrome
      url = window.webkitURL.createObjectURL(file) ;
    }
    return url ;
  }
  
    // 头像预览图
    $('#avatar').change(function(){
        var url=getObjectURL(this.files[0]);
        if(url){
          $('#img').attr('src',url);
        }
      });
</script>

